%h1
  = t('.controls')

.well
  .alert#operation_progress
    %button.close{"data-dismiss" => "alert", :type => "button"} ×
    %strong
      = t('.these_actions_will_affect_existing_data')
  = form_tag manage_translations_path, remote: true, id: 'manage_form', class: 'form-search' do
    = select_tag 'locale', options_for_select(I18n.available_locales.collect{ |locale| [language_name(locale), locale.to_s] }.insert(0, [t('.all'), 'all'])), {:prompt => t('.select_locale')}
    = hidden_field_tag :manage_action
    = link_to 'yaml2db', '#', class: 'manage-button btn btn-primary', 'data-action' => 'yaml2db'
    = link_to 'db2yaml', '#', class: 'manage-button btn btn-primary', 'data-action' => 'db2yaml'
    #spinner

%h1
  = t('.dashboard')

.span12
  %table.table.table-striped.table-bordered
    %thead
      %tr
        %th
          = t('.language')
        %th
          = t('.progress')
        %th
          = t('.translated')
        %th
          = t('.pending')
        %th
          = t('.untranslated')


    %tbody
      - @langs.each do |lang|
        %tr
          %td
            = link_to @stats[lang]['name'], set_lang_to_path(lang: lang.to_s)
          %td
            .progress
              .bar.bar-success{ style: "width: #{@stats[lang]['translated_percentage']}%;" }
              .bar.bar-warning{ style: "width: #{@stats[lang]['pending_percentage']}%;" }
              .bar.bar-danger{ style: "width: #{@stats[lang]['untranslated_percentage']}%;" }
          %td
            = "#{@stats[lang]['translated_count']}(#{@stats[lang]['translated_percentage']}%)"
          %td
            = "#{@stats[lang]['pending_count']}(#{@stats[lang]['pending_percentage']}%)"
          %td
            = "#{@stats[lang]['untranslated_count']}(#{@stats[lang]['untranslated_percentage']}%)"
%h1
  = t('.activity')
.span12

  = form_for @activity_query, url: :search_activity, html: { method: :get, id: :search_form, class: 'pull-left form-search' } do |f|
    = f.text_field :translation_key_name, class: 'search_field input-medium',  placeholder: 'KEY'

    = f.select :lang, I18n.available_locales.collect { |locale| [locale.to_s, locale.to_s] }, {:include_blank => t('.select_locale')}, class: 'search_field'

    = f.text_field :translator_identifier, class: 'search_field input-medium',  placeholder: translator_identifier_placeholder

    = f.text_field :created_at_gteq, class: 'search_field datepicker input-medium',  placeholder: 'FROM DATE'

    = f.text_field :created_at_lteq, class: 'search_field datepicker input-medium', placeholder: 'TO DATE'

    %button.btn#search_activity{ type: :button }
      = t('.search')
    %button.btn#search_reset{ type: :button }
      = t('.reset')
    
  #activity
    = render 'activity', translations_changes: @translations_changes


:javascript
  $('.manage-button').click(function(){
    if(confirm('Are you sure you want to perform this operation ?'))
    {
      $('#spinner').show();
      var target = document.getElementById('spinner');
      var spinner = new Spinner(spinner_params).spin(target);
      $('#manage_action').val($(this).data('action'))
      $('#operation_progress').removeClass('alert-success')
      var msg = $(this).data('action') == 'yaml2db' ? 'Transfering yaml translations to db' : 'Transfering db translations to yaml files'
      $('#operation_progress strong').text(msg)
      $('#manage_form').submit()
    }
    return false;
  })

  // hit search directly when pressing enter
  $(".search_field").keyup(function(event){
    if(event.keyCode == 13){
        $('#search_activity').click();
    }
  });

      


  
  